<template>
	<view class="container">
		<view class="toggle-btn" @click="toggleSidebar">
			<u-icon name="list" size="28" color="#606266"></u-icon>
		</view>
		<view class="upload-btn" @click="toUpload()">
			<image src="../../static/upload.png" mode="aspectFit"></image>
		</view>

		<view @click="isList = !isList" class="listSwitch" v-if="contentList.length != 0">
			<u-icon :name="isList ? 'list-dot' :'grid'" color="#2979ff" size="28"></u-icon>
		</view>
		<!-- <view class="btn-group">
			<u-button type="primary" text="上传" @click="toUpload()" class="search-btn"></u-button>
		</view> -->
		<!--左侧树形菜单 -->
		<view class="left-sidebar" :class="{ 'sidebar-visible': isSidebarVisible }" @touchmove.stop.prevent="() =>{}">
			<view class="sidebar-header">
				<!-- <text class="title">文件夹</text> -->
				<u-tabs :list="headerList" @click="clickHeader" :scrollable="false" :current="currentTab"></u-tabs>
				<u-icon name="close" size="24" color="#999" @click="toggleSidebar" class="close-icon" />
			</view>
			<view class="newFolder-btn layout-start" @click="newFolder()" v-if="currentTab == 0">
				<image src="../../static/new_folder.png" mode="aspectFit"></image>
				<text class="greyTxt">新建文件夹</text>
			</view>
			<scroll-view scroll-y class="tree-container">
				<TreeNodes :nodes="treeData" :active-node="activeNode" :fileType="currentTab"
					@node-click="handleNodeClick" @del-folder="delFolder" @edit-folder="editFolder"
					@new-folder="newFolder" />
			</scroll-view>
			<!-- 修改文件夹弹窗 -->
			<u-popup :show="isEditFolder" @close="closeEditFolder" @open="openEditFolder" mode="center" closeable>
				<view class="popupContent">
					<view class="txtTitle">修改文件夹</view>
					<view>
						<u--form labelPosition="left" labelWidth="85" :model="editFolderParams" :rules="rulesEditFolder"
							ref="uFormEditFolder">
							<u-form-item label="文件夹名称:" prop="newFolderName">
								<u--input placeholder="请输入文件夹名称" v-model="editFolderParams.newFolderName"></u--input>
							</u-form-item>
						</u--form>
					</view>
					<view class="btn-group">
						<u-button text="取消" @click="closeEditFolder" class="cancel-btn"></u-button>
						<u-button text="确定" type="primary" class="search-btn" @click="confirmEditFolder"></u-button>
					</view>
				</view>
			</u-popup>
			<!-- 新建文件夹 -->
			<u-popup :show="isNewFolder" @close="closeNewFolder" @open="openNewFolder" mode="center" closeable>
				<view class="popupContent">
					<view class="txtTitle">新建文件夹</view>
					<view>
						<u--form labelPosition="left" labelWidth="85" :model="newFolderParams" :rules="rulesFolder"
							ref="uFormFolder">
							<u-form-item label="文件夹名称:" prop="folderName">
								<u--input placeholder="请输入文件夹名称" v-model="newFolderParams.folderName"></u--input>
							</u-form-item>
						</u--form>
					</view>
					<view class="btn-group">
						<u-button text="取消" @click="closeNewFolder" class="cancel-btn"></u-button>
						<u-button text="确定" type="primary" class="search-btn" @click="confirmNewFolder"></u-button>
					</view>
				</view>
			</u-popup>
		</view>
		<!-- 遮罩层 -->
		<view class="mask" v-show="isSidebarVisible" @click="toggleSidebar"></view>
		<!--右侧内容区域 -->
		<view class="right-content" :class="{ 'content-moved': isSidebarVisible }">
			<view class="search-content">
				<view class="search-item">
					<text class="search-label">关键字：</text>
					<u--input placeholder="请输入内容" shape="circle" v-model="searchParams.stem"></u--input>
				</view>
				<view class="btn-group">
					<u-button text="查询" type="primary" loadingText="查询中" class="search-btn"
						@click="toSearch"></u-button>
				</view>
			</view>
			<template v-if="contentList.length!=0"><!-- currentContent -->
				<view class="content-header" v-if="isList">
					<view class="sort-bar">
						<u-button @click="changeSortType('lastModifiedTime')" size="mini">
							时间 {{ sortType === 'lastModifiedTime' ? (asc ? '↑' : '↓') : '' }}
						</u-button>
						<u-button @click="changeSortType('fileSizeKB')" size="mini">
							大小 {{ sortType === 'fileSizeKB' ? (asc ? '↑' : '↓') : '' }}
						</u-button>
						<u-button @click="changeSortType('fileName')" size="mini">
							名称 {{ sortType === 'fileName' ? (asc ? '↑' : '↓') : '' }}
						</u-button>
					</view>
					<view class="thTitle">
						<u-row>
							<u-col span="4">
								<view>
									文件名
								</view>
							</u-col>
							<!-- <u-col span="2">
								<view>文件类型</view>
							</u-col> -->
							<u-col span="3">
								<view>文件大小</view>
							</u-col>
							<u-col span="3">
								<view>文件上传时间</view>
							</u-col>
							<u-col span="2">
								<view>操作</view>
							</u-col>
						</u-row>
					</view>
					<u-row v-for="(item,index) in contentList" :key="index">
						<u-col span="4">
							<view class="layout-start" @click="handleFolderClick(item)">
								<u-image :src="getFileIcon(item.fileType)" mode="aspectFit" width="30px"
									height="30px"></u-image>
								<text class="fileNameTxt">{{item.fileName}}</text>
							</view>
						</u-col>
						<!-- <u-col span="2">
							<view>{{item.fileType}}</view>
							
						</u-col> -->
						<u-col span="3">
							<view class="greyTxt">{{item.fileSizeKB}}KB</view>
						</u-col>
						<u-col span="3">
							<view class="greyTxt">{{item.lastModifiedTime}}</view>
						</u-col>
						<!-- <u-col span="4">
							<view class="fileNameTxt">
								{{currentContent.fileName}}
							</view>
						</u-col>
						<u-col span="2">
							<view>{{currentContent.fileType}}</view>
						</u-col>
						<u-col span="3">
							<view>{{currentContent.fileSizeKB}}KB</view>
						</u-col>
						<u-col span="3">
							<view>{{currentContent.lastModifiedTime}}</view>
						</u-col> -->
						<u-col span="2">
							<view class="content-body layout-between" v-if="item.fileType!='folder'">
								<view class="download" @click="toDownload(item.fileName)">
									<image src="../../static/download.png" mode="aspectFit"></image>
								</view>
								<view class="delFile" @click="toDelFile(item.fileName)">
									<image src="../../static/delete.png" mode="aspectFit"></image>
								</view>
							</view>
						</u-col>
					</u-row>
				</view>
				<view v-else>
					<u-grid :col="3">
						<u-grid-item v-for="(item, index) in contentList" :key="index">
							<u-image :src="getFileIcon(item.fileType)" mode="aspectFit" width="30px" height="30px"
								@click="handleFolderClick(item)"></u-image>
							<text class="grid-text">{{ item.fileName }}</text>
							<view class="greyTxt">{{item.fileSizeKB}}KB</view>
						</u-grid-item>
					</u-grid>
				</view>
			</template>
			<u-empty v-else mode="data" icon="../../static/dataEmpty.png" />
			<u-popup :show="isUpload" @close="closeUpload" @open="openUpload" mode="center" closeable>
				<view class="popupContent">
					<view class="txtTitle">上传文件</view>
					<view>
						<u--form labelPosition="left" :model="uploadParams" :rules="rules" ref="uForm" labelWidth="65">
							<!-- <u-form-item label="文件夹" prop="folderName">
								<zxz-uni-data-select :localdata="options.folderName.list" placeholder="请选择文件夹"
									v-model="uploadParams.folderName" dataKey="key" dataValue="value">
								</zxz-uni-data-select>
							</u-form-item> -->
							<u-form-item label="上传" prop="file">
								<u-upload :fileList="fileList1" @afterRead="afterRead" @delete="deletePic" name="1"
									multiple :maxCount="10" accept="file" previewImage uploadText="请上传文件">
								</u-upload>
							</u-form-item>
						</u--form>
					</view>
					<view class="btn-group">
						<u-button text="取消" @click="closeUpload" class="cancel-btn"></u-button>
						<u-button text="确定" type="primary" class="search-btn" @click="confirmUpload"></u-button>
					</view>
				</view>
			</u-popup>

		</view>
	</view>
</template>

<script>
	import {
		readFolder,
		readDocList,
		createFolder
	} from '../../utils/api.js'
	import TreeNodes from '../../components/treeNodes.vue'
	export default {
		components: {
			TreeNodes
		},
		data() {
			return {
				isUpload: false,
				uploadParams: {
					file: '',
					folderName: '',
				},
				rules: {
					'folderName': {
						type: 'string',
						required: true,
						message: '请选择文件夹',
						trigger: ['blur', 'change']
					},
				},
				options: {
					folderName: {
						list: [],
						checked: false,
					},

				},
				fileList1: [],
				activeNode: null,
				treeData: [],
				isSidebarVisible: false, // 侧边栏显示状态
				isNewFolder: false,
				newFolderParams: {
					folderName: '',
				},
				rulesFolder: {
					'folderName': {
						type: 'string',
						required: true,
						message: '请输入文件夹名称',
						trigger: ['blur', 'change']
					},
				},
				isEditFolder: false,
				editFolderParams: {
					folderName: "",
					newFolderName: ""
				},
				rulesEditFolder: {
					'newFolderName': {
						type: 'string',
						required: true,
						message: '请输入新的文件夹名称',
						trigger: ['blur', 'change']
					},
				},
				headerList: [{
					name: '文件夹',
				}, {
					name: '部门',
				}],
				filePath: 'C:/uploaded/文件夹', //默认值
				sortType: 'lastModifiedTime', // 当前排序类型    
				asc: false, // 是否升序
				contentList: [],
				folderNameParams: null,
				isList: true, // 控制布局模式
				// 查询
				searchParams: {
					stem: '',
				},
				//仅用于向后端传递数据
				paramsValue: {
					folderName: null,
					filePath: null,
					sortBy: '',
					order: 'desc',
					filterName: null,
				},
				newfolderNameParams: null,
				newfilePath: 'C:/uploaded/文件夹', //默认值
				currentTab: 0,
			}
		},
		created() {
			this.generateTree()
		},
		mounted() {
			// 默认选中第一个节点  
			if (this.treeData.length > 0) {
				this.activeNode = this.treeData[0].id
			}
		},
		computed: {
			// currentContent() {
			// 	const findContent = (nodes) => {
			// 		for (const node of nodes) {
			// 			if (node.id === this.activeNode) return node.content
			// 			if (node.children) {
			// 				const result = findContent(node.children)
			// 				if (result) return result
			// 			}
			// 		}
			// 		return null
			// 	}
			// 	return findContent(this.treeData)
			// }
		},
		methods: {
			toUpload() {
				this.isUpload = true
			},
			closeUpload() {
				this.isUpload = false
			},
			openUpload() {
				this.getOptions()
			},
			confirmUpload() {
				this.$refs.uForm.validate().then(res => {
					var folderName = null
					folderName = this.folderNameParams
					// if (this.newfolderNameParams) {
					// 	folderName = this.newfolderNameParams
					// } else {
					// 	folderName = this.folderNameParams
					// }
					// if (this.folderNameParams != null) {
					// 	this.newfilePath = this.filePath + "/" + this.folderNameParams
					// } else {
					// 	this.newfilePath = this.filePath + "/"
					// }
					// console.log("newfilePath", this.newfilePath);
					this.fileList1.forEach((e) => {
						const getBaseUrl = uni.getStorageSync('netVal');
						uni.uploadFile({
							url: getBaseUrl + '/jqmk/file/upload', // 接口地址
							filePath: e.url,
							name: 'file',
							formData: {
								file: e.url,
								folderName: folderName,
								filePath: `${this.filePath}/`
							},
							headers: {
								"Content-Type": "multipart/form-data"
							},
							success: (res) => {
								let s = JSON.parse(res.data)
								if (s.code == 20000) {
									uni.$u.toast(s.message)
									this.fileList1 = []
									this.closeUpload()									
									this.readDocList(folderName, this.filePath)
									//置空
									// this.uploadParams.folderName = []
									folderName = null
									// 重置基础路径
									if (this.currentTab == 0) {
										//文件夹
										this.newfilePath = 'C:/uploaded/文件夹'
									} else if (this.currentTab == 1) {
										//部门
										this.newfilePath = 'C:/uploaded/部门'
									}
									this.generateTree(this.newfilePath)
									// const pathSegment = this.findParentPath(this.treeData, node.id);
									// if (pathSegment && pathSegment.length > 0) {
									// 	this.filePath = `${this.filePath}/${pathSegment.join('/')}`;
									// }
								}else{
									uni.showToast({
										title: s.message,
										icon: "none"
									})
								}
							}
						});
					})
				})
			},
			getOptions() {
				readFolder({
					filePath: `${this.filePath}`
				}).then(s => {
					if (s.code === 20000) {
						this.options.folderName.list = s.data.map(item => ({
							key: item.name,
							value: item.name
						}));
					} else {
						uni.showToast({
							title: s.message,
							icon: "none"
						})
					}
				})
			},
			// 删除图片
			deletePic(event) {
				this[`fileList${event.name}`].splice(event.index, 1)
			},
			// 新增图片
			afterRead(event) {
				// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
				let lists = [].concat(event.file) //新增的文件
				lists.map((item) => {
					// if (!/\.(docx|doc|DOCX|DOC)$/.test(item.name)) {
					// setTimeout(() => {
					// 	uni.$u.toast('上传文件只能为word文件，且为docx,doc格式')
					// }, 100);
					// } else {
					this[`fileList${event.name}`].push({
						...item,
					})
					// }
				})
			},
			handleNodeClick(node) {
				// console.log("this.activeNode",this.activeNode);
				this.activeNode = node.id
				// 这里可以添加其他逻辑，比如请求接口获取内容等   
				// console.log("node", node);
				// console.log("treeData", this.treeData);
				if (node.children) {
					this.isSidebarVisible = true
				} else {
					//关闭
					this.isSidebarVisible = false
					this.folderNameParams = null
					const parentLabel = this.findParentLabel(this.treeData, node.id);
					// 调用祖先节点的路径
					const pathSegment = this.findParentPath(this.treeData, node.id);
					// this.filePath = this.filePath + '/' + `${pathSegment}`;
					if (parentLabel) {
						this.folderNameParams = parentLabel
					} else {
						this.folderNameParams = node.label
					}
					// 重置基础路径       
					if (this.currentTab == 0) {
						//文件夹
						this.filePath = 'C:/uploaded/文件夹'
					} else if (this.currentTab == 1) {
						//部门
						this.filePath = 'C:/uploaded/部门'
					}
					if (pathSegment && pathSegment.length > 0) {
						this.filePath = `${this.filePath}/${pathSegment.join('/')}`;
					}
					// // 移除末尾斜杠    
					// this.filePath = this.filePath.replace(/\/$/, '');
					// this.filePath +=node.label
					console.log("pathSegment", pathSegment);
					console.log("filepath", this.filePath);
					this.readDocList(this.folderNameParams, this.filePath)
				}

			},
			readDocList(folderNameParams, filePath) {
				readDocList({
					folderName: folderNameParams,
					filePath: filePath
				}).then(s => {
					if (s.code === 20000) {
						this.contentList = s.data
					} else {
						uni.showToast({
							title: s.message,
							icon: "none"
						})
					}
				})
			},
			// 递归查找父节点
			findParentLabel(tree, targetId, parent = null) {
				for (const node of tree) {
					if (node.id === targetId) {
						return parent ? parent.label : null; // 找到目标节点，返回父节点label
					}
					if (node.children && node.children.length > 0) {
						const result = this.findParentLabel(node.children, targetId, node);
						if (result) return result; // 子节点中找到则返回结果
					}
				}
				return null; // 未找到
			},
			//祖先节点的路径
			findParentPath(tree, targetId, path = []) {
				for (const node of tree) {
					if (node.id === targetId) {
						return path; // 直接返回已累积的路径
					}
					if (node.children) {
						const found = this.findParentPath(node.children, targetId, [...path, node.label]);
						// console.log("node.children",node.children);
						// console.log("found", found);
						if (found) return found;
					}
				}
				return null;
			},
			toggleSidebar() {
				this.isSidebarVisible = !this.isSidebarVisible
				this.searchParams.stem = ''
			},

			async generateTree(newfilePath) {
				// 递归处理节点
				const processNode = (node, parentId, index) => {
					const nodeId = parentId ? `${parentId}-${index}` : `${index}`; // 生成唯一id
					const newNode = {
						id: nodeId,
						label: node.name
					};
					// 只有当children非空时，才递归处理子节点
					if (node.children && node.children.length > 0) {
						newNode.children = node.children.map((child, childIndex) =>
							processNode(child, nodeId, childIndex)
						);
					}
					return newNode;
				};
				if(newfilePath){
					this.newfilePath=newfilePath
				}else{
					this.newfilePath=this.newfilePath
				}
				await readFolder({
					filePath: this.newfilePath
				}).then(s => {
					if (s.code === 20000) {
						// 处理第一层节点
						this.treeData = s.data.map((folder, index) =>
							processNode(folder, null, index + 1) // 根节点id从1开始
						);
					} else {
						uni.showToast({
							title: s.message,
							icon: "none"
						});
					}
				});
			},
			toDownload(fileName) {
				// var fileName = ''
				var folderName = ''
				// for (const folder of this.treeData) {
				// 	for (const doc of folder.children) {
				// 		if (doc.id == this.activeNode) {
				// 			fileName = doc.content.fileName
				// 		}
				// 	}
				// }
				this.treeData.find((item) => {
					// console.log("item", item.id, this.activeNode.split('-')[0],"this.activeNode",this.activeNode);
					if (item.id == this.activeNode.split('-')[0]) {
						folderName = item.label
					}
				})
				// const fileName=this.treeData.children.find((item)=>item.id==this.activeNode).content
				// #ifdef H5
				const getBaseUrl = uni.getStorageSync('netVal');
				uni.request({
					url: getBaseUrl + '/jqmk/file/readDoc',
					method: 'get',
					responseType: 'arraybuffer',
					header: {
						token: uni.getStorageSync('token'),
						"Content-type": "application/json; charset=UTF-8"
					},
					data: {
						folderName: folderName,
						fileName: fileName,
						filePath: `${this.filePath}/`
					},
					success: res => {
						if (res.statusCode === 200) {
							console.log("uni.request res", res);
							let blob = new Blob([res.data]);
							let downloadElement = document.createElement("a");
							let href = window.URL.createObjectURL(blob); //创建下载的链接
							downloadElement.href = href;
							downloadElement.download = fileName; //下载后文件名
							document.body.appendChild(downloadElement);
							downloadElement.click(); //点击下载
							document.body.removeChild(downloadElement); //下载完成移除元素
							window.URL.revokeObjectURL(href); //释放掉blob对象
							//uni-app中Blob显示未被定义，在h5是没问题的，请问在App端如何解决这个问题？非H5端不是浏览器环境不支持 Dom、Bom 接口，没有 Blob 也没有 document 。

						}
					},
					fail: err => {}
				})
				// #endif				
				// #ifdef APP
				const getBaseUrl = uni.getStorageSync('netVal');
				uni.downloadFile({
					url: `${getBaseUrl}/jqmk/file/readDoc?folderName=${folderName}&fileName=${fileName}&filePath=${this.filePath}/`,
					header: {
						token: uni.getStorageSync('token'),
					},
					success: (res) => {
						const filePath = res.tempFilePath;
						if (res.statusCode === 200) {
							console.log('下载成功', res);
						}
						uni.saveFile({
							tempFilePath: filePath,
							success: (res1) => {
								// this.isShowProgress = false;
								// console.log("uni.saveFile res1", res1);
								var saveFilePath = res1.savedFilePath;
								uni.showModal({
									title: "提示",
									content: "文件已保存：" + saveFilePath,
									cancelText: "我知道了",
									confirmText: "打开文件",
									success: (res2) => {
										if (res2.confirm) {
											uni.openDocument({
												filePath: saveFilePath,
												success: (res) => {
													console.log("打开文档成功",
														JSON.stringify(
															res))
												}
											})
										}
									}
								})
							}
						})
					},
				});
				// #endif
			},
			newFolder(node) {
				console.log("node", node);
				this.isNewFolder = true
				if(node){
					const pathSegment = this.findParentPath(this.treeData, node.id);
					if (pathSegment && pathSegment.length > 0) {
						this.filePath = `${this.filePath}/${pathSegment.join('/')}`;
					}
					this.filePath = this.filePath + '/' + node.label
				}
			},
			closeNewFolder() {
				this.isNewFolder = false
				this.filePath = 'C:/uploaded/文件夹'
			},
			openNewFolder() {

			},
			confirmNewFolder() {
				this.$refs.uFormFolder.validate().then(res => {
					const getBaseUrl = uni.getStorageSync('netVal');
					// if(this.folderNameParams !=null){
					// 	var newfilePath = this.filePath + "/" + this.folderNameParams
					// 	console.log("newfilePath",newfilePath);
					// }					
					let data = {
						folderName: this.newFolderParams.folderName,
						filePath: `${this.filePath}/`
					};
					let that = this
					uni.request({
						url: getBaseUrl + '/jqmk/file/createFolder',
						method: 'POST',
						data: data,
						header: {
							'Content-Type': 'application/x-www-form-urlencoded' //multipart/form-data /
						},
						success: async function(response) {
							// 请求成功的回调
							if (response.data.code === 20000) {
								uni.showToast({
									title: "创建成功",
									icon: 'success'
								})
								that.newFolderParams = {}
								that.closeNewFolder()
								// 重置基础路径
								if (that.currentTab == 0) {
									//文件夹
									that.filePath = 'C:/uploaded/文件夹'
								} else if (that.currentTab == 1) {
									//部门
									that.filePath = 'C:/uploaded/部门'
								}
								// that.toggleSidebar()
								await that.generateTree()
							} else {
								uni.showToast({
									title: response.data.message,
									icon: "none"
								})
							}
						},
						fail: function(error) {
							// 请求失败的回调
							console.error(error);
						}
					});
				})
			},
			delFolder(node) {
				// console.log("node", node);
				const getBaseUrl = uni.getStorageSync('netVal');
				const pathSegment = this.findParentPath(this.treeData, node.id);
				if (pathSegment && pathSegment.length > 0) {
					this.filePath = `${this.filePath}/${pathSegment.join('/')}`;
				}
				let data = {
					folderName: node.label,
					filePath: `${this.filePath}/`
				};
				let that = this
				uni.request({
					url: getBaseUrl + '/jqmk/file/deleteFolder',
					method: 'DELETE',
					data: data,
					header: {
						'Content-Type': 'application/x-www-form-urlencoded' //multipart/form-data /
					},
					success: async function(response) {
						// 请求成功的回调
						if (response.data.code === 20000) {
							uni.showToast({
								title: "删除成功",
								icon: 'success'
							})
							// 重置基础路径
							if (that.currentTab == 0) {
								//文件夹
								that.filePath = 'C:/uploaded/文件夹'
							} else if (that.currentTab == 1) {
								//部门
								that.filePath = 'C:/uploaded/部门'
							}
							await that.generateTree()
						} else {
							uni.showToast({
								title: response.data.message,
								icon: "none"
							})
						}
					},
					fail: function(error) {
						// 请求失败的回调
						console.error(error);
					}
				});
			},
			toDelFile(fileName) {
				const getBaseUrl = uni.getStorageSync('netVal');
				// var fileName = ''
				var folderName = ''
				// for (const folder of this.treeData) {
				// 	for (const doc of folder.children) {
				// 		if (doc.id == this.activeNode) {
				// 			fileName = doc.content.fileName
				// 		}
				// 	}
				// }
				this.treeData.find((item) => {
					// console.log("item", item.id, this.activeNode.split('-')[0]);
					if (item.id == this.activeNode.split('-')[0]) {
						folderName = item.label
					}
				})
				// if (this.folderNameParams != null) {
				// 	this.newfilePath = this.filePath + "/" + this.folderNameParams
				// } else {
				// 	this.newfilePath = this.filePath + "/"
				// }
				let that = this
				uni.request({
					url: getBaseUrl + '/jqmk/file/deleteDoc',
					method: 'DELETE',
					data: {
						folderName: folderName,
						fileName: fileName,
						filePath: `${that.filePath}/`
					},
					header: {
						'Content-Type': 'application/x-www-form-urlencoded' //multipart/form-data /
					},
					success: async function(response) {
						// 请求成功的回调
						if (response.data.code === 20000) {
							uni.showToast({
								title: "删除成功",
								icon: 'success'
							})
							that.readDocList(folderName, that.filePath)
							// 重置基础路径
							if (that.currentTab == 0) {
								//文件夹
								that.newfilePath = 'C:/uploaded/文件夹'
							} else if (that.currentTab == 1) {
								//部门
								that.newfilePath = 'C:/uploaded/部门'
							}
							await that.generateTree(that.newfilePath)
							
						} else {
							uni.showToast({
								title: response.data.message,
								icon: "none"
							})
						}
					},
					fail: function(error) {
						// 请求失败的回调
						console.error(error);
					}
				});
			},
			//
			editFolder(node) {
				this.isEditFolder = true
				this.editFolderParams.newFolderName = node.label
				this.editFolderParams.folderName = node.label
				const pathSegment = this.findParentPath(this.treeData, node.id);
				if (pathSegment && pathSegment.length > 0) {
					this.filePath = `${this.filePath}/${pathSegment.join('/')}`;
				}
			},
			closeEditFolder() {
				this.isEditFolder = false
			},
			openEditFolder() {

			},
			confirmEditFolder() {
				this.$refs.uFormEditFolder.validate().then(res => {
					const getBaseUrl = uni.getStorageSync('netVal');					
					let data = {
						folderName: this.editFolderParams.folderName,
						newFolderName: this.editFolderParams.newFolderName,
						filePath: `${this.filePath}/`
					};
					let that = this
					uni.request({
						url: getBaseUrl + '/jqmk/file/renameFolder',
						method: 'POST',
						data: data,
						header: {
							'Content-Type': 'application/x-www-form-urlencoded' //multipart/form-data /
						},
						success: async function(response) {
							// 请求成功的回调
							if (response.data.code === 20000) {
								uni.showToast({
									title: "修改成功",
									icon: 'success'
								})
								that.editFolderParams = {}
								that.closeEditFolder()
								// 重置基础路径
								if (that.currentTab == 0) {
									//文件夹
									that.filePath = 'C:/uploaded/文件夹'
								} else if (that.currentTab == 1) {
									//部门
									that.filePath = 'C:/uploaded/部门'
								}
								await that.generateTree()
							} else {
								uni.showToast({
									title: response.data.message,
									icon: "none"
								})
							}
						},
						fail: function(error) {
							// 请求失败的回调
							console.error(error);
						}
					});
				})
			},
			clickHeader(currentTab) {
				this.currentTab = currentTab.index
				if (currentTab.index == 0) {
					//文件夹
					this.filePath = 'C:/uploaded/文件夹'
					this.generateTree(this.filePath)
				} else if (currentTab.index == 1) {
					//部门
					this.filePath = 'C:/uploaded/部门'
					this.generateTree(this.filePath)
				}

			},
			changeSortType(type) {
				if (this.sortType === type) {
					// 相同类型切换排序方向     
					this.asc = !this.asc
				} else {
					// 不同类型重置为降序      
					this.sortType = type
					this.asc = false

				}
				var order = null
				if (this.asc) {
					order = 'asc'
				} else {
					order = 'desc'
				}
				this.paramsValue.order = order
				this.toSearch()
			},
			getFileIcon(type) {
				type = type.toLowerCase();
				// 统一转为小写     
				const icons = {
					'doc': '/static/dataMan/doc.png',
					'docx': '/static/dataMan/doc.png',
					'xls': '/static/dataMan/excel.png',
					'xlsx': '/static/dataMan/excel.png',
					'folder': '/static/dataMan/folder.png',
					'txt': '/static/dataMan/txt.png'
				};
				return icons[type] || '/static/dataMan/file-unknown.png';
				// 默认图标    
			},
			async handleFolderClick(item) {
				if (item.fileType.toLowerCase() === 'folder') {
					var newfilePath = this.filePath + "/" + this.folderNameParams
					this.newfolderNameParams = item.fileName
					await this.readDocList(this.newfolderNameParams, newfilePath)
					//删除、上传、下载

				}
			},
			toSearch() {
				//获取处理后的查询数据
				this.paramsValue.folderName = this.folderNameParams
				this.paramsValue.filePath = this.filePath
				this.paramsValue.filterName = this.searchParams.stem
				this.paramsValue.sortBy = this.sortType
				//过滤空的参数
				const params = Object.keys(this.paramsValue).filter((key) => this.paramsValue[key] !== null && this
					.paramsValue[key] !== '' && this.paramsValue[key] !== undefined).reduce((acc, key) => ({
					...acc,
					[key]: this.paramsValue[key]
				}), {})
				// console.log("const params", params);				
				readDocList(params).then(s => {
					if (s.code === 20000) {
						this.contentList = s.data
						this.paramsValue = {}
					} else {
						uni.showToast({
							title: s.message,
							icon: "none"
						})
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.popupContent {
		margin-top: 40rpx;
		position: relative;
		box-sizing: border-box;
		padding: 0rpx 40rpx 10rpx;
		width: 660rpx;
		max-height: 1300rpx;
		overflow-y: auto;
	}

	.txtTitle {
		box-sizing: border-box;
		padding: 10rpx 0px;
		text-align: center;
		line-height: 2;
		font-weight: 800;
		font-size: 40rpx;
		margin-top: 20rpx;
	}

	.tipsTitle {
		font-weight: 800;
		line-height: 2;
	}

	.btn-group {
		display: flex;
		margin-top: 30rpx;
		width: 100%;
		position: relative;
		justify-content: space-between;

		.search-btn {
			width: 40%;
			border-radius: 100rpx;
			background: linear-gradient(to right, #7774ff, #017ffd, #01b1fd);
			color: #ffffff;
		}

		.cancel-btn {
			width: 40%;
			border-radius: 100rpx;
		}


	}

	.container {
		display: flex;
		height: 100vh;
	}



	.right-content {
		flex: 1;
		padding: 20rpx;
		overflow-y: auto;
		margin-top: 100rpx;
	}

	.content-header {
		// margin-bottom: 60rpx;
		// border-bottom: 1px solid #e4e7ed;
		padding: 20rpx 0rpx;
	}

	.content-body {
		line-height: 1.6;
		color: #606266;
	}

	.toggle-btn {
		position: fixed;
		left: 20rpx;
		top: 80rpx;
		z-index: 999;
		padding: 10rpx;
		background: rgba(255, 255, 255, 0.9);
		border-radius: 50%;
		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
	}

	.left-sidebar {
		position: fixed;
		left: -500rpx;
		top: 0;
		bottom: 0;
		width: 500rpx;
		background: #fff;
		z-index: 1000;
		box-shadow: 4px 0 12px rgba(0, 0, 0, 0.1);
		transition: all 0.3s ease;
		display: flex;
		flex-direction: column;
	}

	.sidebar-visible {
		left: 0;
	}

	.sidebar-header {
		padding: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #eee;
	}

	.title {
		font-size: 34rpx;
		font-weight: bold;
	}

	.close-icon {
		padding: 10rpx;
	}

	.tree-container {
		flex: 1;
		// overflow-y: auto;
		padding: 20rpx 0;

	}

	.mask {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0, 0, 0, 0.3);
		z-index: 999;
	}

	.content-moved {
		transform: translateX(300px);
	}

	@media (min-width: 768px) {
		.left-sidebar {
			position: static;
			width: 280rpx;
			box-shadow: none;
		}

		.toggle-btn {
			display: none;
		}

		.mask {
			display: none;
		}

		.content-moved {
			transform: none;
		}
	}

	.newFolder-btn {
		// position: fixed;
		// left: 210rpx;
		// top: 80rpx;
		// z-index: 999;
		padding: 10rpx;
		background: rgba(255, 255, 255, 0.9);
		// border-radius: 50%;
		// box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
	}

	.newFolder-btn image {
		display: block;
		// padding: 20rpx;
		box-sizing: border-box;
		width: 50rpx;
		height: 50rpx;
		margin-left: 20rpx;
		margin-right: 20rpx;
	}

	.download {
		// position: fixed;
		// left: 300rpx;
		// top: 80rpx;
		// z-index: 999;
		// padding: 10rpx;
		// background: rgba(255, 255, 255, 0.9);
		// border-radius: 50%;
		// box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);

		image {
			display: block;
			// padding: 20rpx;
			box-sizing: border-box;
			width: 50rpx;
			height: 50rpx;
		}

	}

	.delFile {
		// position: fixed;
		// left: 390rpx;
		// top: 80rpx;
		// z-index: 999;
		// padding: 10rpx;
		// background: rgba(255, 255, 255, 0.9);
		// border-radius: 50%;
		// box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);

		image {
			display: block;
			// padding: 20rpx;
			box-sizing: border-box;
			width: 50rpx;
			height: 50rpx;
		}
	}

	.upload-btn {
		position: fixed;
		left: 120rpx;
		top: 80rpx;
		z-index: 999;
		padding: 10rpx;
		background: rgba(255, 255, 255, 0.9);
		border-radius: 50%;
		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);

		image {
			display: block;
			// padding: 20rpx;
			box-sizing: border-box;
			width: 50rpx;
			height: 50rpx;
		}
	}

	.thTitle {
		box-sizing: border-box;
		padding-bottom: 10rpx;
		margin-bottom: 10rpx;
		border-bottom: 1px solid #e4e7ed;
		font-size: 28rpx;
		font-weight: bold;
		text-align: center;
		line-height: 1.5;
	}

	.fileNameTxt {
		width: 100%;
		position: relative;
		padding-left: 10rpx;
		box-sizing: border-box;
		overflow: auto;
	}

	/deep/.u-tabs__wrapper__nav__item {
		flex: 1 1 auto !important;
	}

	.sort-bar {
		padding: 20rpx;
		display: flex;
		gap: 20rpx;
		background: #f8f8f8;

		/deep/ .u-btn {
			flex: 1;
		}
	}

	.listSwitch {
		position: fixed;
		left: 210rpx; //300rpx;
		top: 80rpx;
		z-index: 999;
		padding: 10rpx;
		background: rgba(255, 255, 255, 0.9);
		border-radius: 50%;
		box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
	}

	.greyTxt {
		font-size: 24rpx;
		color: #606266;
	}

	.grid-text {
		position: relative;
		width: 100%;
		text-align: center;
		overflow: auto;
	}

	.u-grid-item {
		padding: 10rpx;
		// margin: 5rpx;
		box-sizing: border-box;
		width: 100%;
	}

	.search-content {
		box-sizing: border-box;
		// padding: 0rpx 15rpx;
		width: 100%;
		position: relative;
		background: #ffffff;

		.search-item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			width: 100%;
			margin-top: 10rpx;
			font-size: 30rpx;
			box-sizing: border-box;
			padding: 10rpx 20rpx;

			.search-label {
				max-width: 300rpx;
				overflow: hidden;
				// text-overflow: ellipsis;
				white-space: nowrap;
				font-size: 30rpx;
			}


		}


	}
</style>